<template>

 <sweet-modal ref="dialogInfo" class="dialog"  :sweetModalMaxWidth="pageWidth">
     <h3>{{title}}</h3>
      <div :style="{maxHeight:maxHeight+'px'}" style="overflow:auto;width:50%;float:left;">
        <div class="layui-form-item">
            <div class="layui-inline">
                <label class="layui-form-label">短信内容</label>
                <div class="layui-input-inline">
                    <el-input class="textareas" type="textarea" style="width:200px;" v-model="ImgData.SMSCONTENT" :readonly="isdisabled"></el-input>
                </div>
            </div>
        </div>

        <div class="layui-form-item">
            <div class="layui-inline">
                <label class="layui-form-label">短信后缀</label>
                <div class="layui-input-inline">
                    <el-input v-model="ImgData.SMSSUFFIX" style="width:200px;" :readonly="isdisabled"></el-input>
                </div>
            </div>
        </div>

        <div class="layui-form-item">
            <div class="layui-inline">
                <label class="layui-form-label">电话号码</label>
                <div class="layui-input-inline">
                    <el-input class="textareas" type="textarea" style="width:200px;" v-model="currentListBtns" :readonly="isdisabled"></el-input>
                </div>
            </div>
        </div>
      </div>
      <div :style="{maxHeight:maxHeight+'px'}" style="overflow:auto;width:50%;float:left;">
        <p style="font-size: 14px;  color: #d85450;">
            电话号码选项
        </p>
        <el-tree
            :data="callinfo"
            :show-checkbox = '!isdisabled'
            node-key="value"
            ref="tree"
            highlight-current
            :default-checked-keys="morenOpen"
            :props="defaultProps"
            @check-change="addRolBtnsPop"
            style="width: 100%; height: 210px; overflow: hidden; overflow-y: scroll; padding-left: 10px;">
        </el-tree>
      </div>
    <div class="layui-form-item btnCenter sweet-btn">
        <el-button  @click="send">发送</el-button>
        <el-button  @click="submit">保存</el-button>
        <el-button  @click="closeDialog">取消</el-button>
    </div>
 </sweet-modal>

</template>

<style  rel="stylesheet/scss" lang="scss">
    .textareas .el-textarea__inner{
        height: 100px!important;
    }
</style>
<script>
const INFO="详情"
const ADD = "新增"
const MODIFY = "修改"
const sends = "发送"
import apiBase from "@/api/apiBase.js";
import sweetModal from "@/components/sweetModal";
import {  formatDate,timeStringToDate,dateStringToDate } from "@/utils/date.js";
  export default {
    data(){
        return{
        ichData:{
            REGSEXs:null
        },
        ichDataEexend:{
            staTime:null,
            endTime:null
            },

        ImgData: {
            SMSCONTENT: null,
            SMSSUFFIX: null,
        },
        callinfo: [],
        list_Cal: [],
        defaultProps: {
          children: 'children',
          label: 'label'
        },
        calls: [],
        form: {
            name: [],//传给后台的电话号码
        },
        smsid: null,
        isdisabled: null,
        currentListBtn: [],//树结构选中的数据
        currentListBtns: null,//输入框中显示的电话号码
        morenOpen: [],
        call_list: [],
        

        pageWidth: 700,
        maxHeight: 500,
        title:null,
        order:null,
        }
    },
      methods:{
        open(order, id) {
            this.order = order;
            this.smsid = id;
            this.dataRepeat();
            
            switch (this.order) {
                case INFO:
                    this.dataInfo(id);
                    this.getcallinfo();//获取电话号码
                    this.isdisabled = true;
                    this.title = "电话发送详情";
                     this.$refs.dialogInfo.open();
                    break;
                case ADD:
                    this.getcallinfo();//获取电话号码
                    this.isdisabled = false;
                    this.$refs.dialogInfo.open();
                    this.title = "电话发送新增";
                    break;
                case MODIFY:
                    this.dataInfo(id);
                    this.getcallinfo();//获取电话号码
                    this.isdisabled = false;
                    this.title = "电话发送修改";
                    this.$refs.dialogInfo.open();
                    break;
            default:
            }
        },
        addOption(value){
            this.calls = [];
            this.form.name.push(value[1]);
        },
        getcallinfo(){
            let data = {};
            apiBase.DoService(
                data,
                apiBase.getApiAdress().ShortMsg.GetCall,
                res => {
                    // this.callinfo = res.data.content;
                    let resdata = res.data.content;
                    resdata.forEach(item => {
                        item.value = item.Value;
                        item.label = item.Text;
                        item.children = item.list_Call;
                        item.children.forEach(items => {
                            items.value = items._cALNUM;
                            // items.label = '[' + items._cALNUM + ']' + '[' + items._cALNAME + ']' + '[' + items._cALADDRESS + ']';
                            items.label = items._cALADDRESS + '-' + items._cALNAME + '-' + items._cALNUM;
                        })
                    });
                    this.callinfo = resdata;
                }
            );
        },
        //提交
        submit(checkout = false) {
            switch (this.order) {
                case ADD:
                    this.dataadd(1);
                    break;
                case MODIFY:
                    this.datamodify(1);
                    break;
                default:
            }
        },
        send(){
            switch (this.order) {
                case ADD:
                    this.dataadd(2);
                    break;
                case MODIFY:
                    this.datamodify(2);
                    break;
                default:
            }
        },
        addRolBtnsPop(key, checked, deep){
            
            // ^[0-9]*$
            var reg=/[a-z,A-Z]/g;//匹配任意字母
            this.currentListBtn = this.$refs.tree
            .getCheckedNodes(true)
            .map(item => item.value);
            this.currentListBtn.forEach((item,index) => {
                var flag = reg.test(item);  
                if(flag == true){
                    this.currentListBtn.splice(index,1);
                }
              
            });
            this.form.name = this.currentListBtn;
            this.currentListBtns = this.currentListBtn.join(',')
        },
        //新增
        dataadd(num){
            let data = JSON.parse(JSON.stringify(this.ImgData));
            data.list_Cal = this.form.name;
            if(num === 2){
               data.isSendMsg = true;
            }
            apiBase.DoService(
                data,
                apiBase.getApiAdress().ShortMsg.Create,
                res => {
                    this.$message({
                        type: "success",
                        message: "新增成功!"
                    });
                    this.$refs.dialogInfo.close();
                    this.refreshData();
                }
            );
        },
        //修改
        datamodify(num){
            let data = JSON.parse(JSON.stringify(this.ImgData));
            data.SMSID = this.smsid;
            data.list_Cal = this.form.name;
            if(num === 2){
               data.isSendMsg = true;
            }
            apiBase.DoService(
                data,
                apiBase.getApiAdress().ShortMsg.Modify,
                res => {
                    this.$message({
                        type: "success",
                        message: "修改成功!"
                    });
                    this.$refs.dialogInfo.close();
                    this.refreshData();
                }
            );
        },
         //登记详情
        dataInfo(id) {
            let data = {
                SMSID: id
            };
            apiBase.DoService(
                data,
                apiBase.getApiAdress().ShortMsg.Detail,
                res => {
                    this.call_list = res.data.content.list_Call;
                    this.form.name = this.call_list;
                    this.call_list.forEach(item => {
                        this.morenOpen.push(item);
                    });
                    this.$refs.tree.setCheckedKeys(this.morenOpen,true);
                    this.ImgData.SMSCONTENT = res.data.content.SMSCONTENT;
                    this.ImgData.SMSSUFFIX = res.data.content.SMSSUFFIX;

                    this.currentListBtns = this.call_list.join(',');
            })
        }, 
         //数据重置
        dataRepeat(){
            this.ImgData =  {
                SMSCONTENT: null,
                SMSSUFFIX: null,
            };
            this.currentListBtns = null;
            this.callinfo = [];

            this.form.name = [];
            this.morenOpen = [];
        },
        closeDialog() {
            this.$refs.dialogInfo.close();
        },
        refreshData(){
            this.$emit('refreshData');
        },
    },
    components: {
        sweetModal
    },
    mounted() {
        
    },
    created() {
    },
  };
</script>

